<div id="mail-sendMail" data-view="mail/sendMail">
<style type="text/css">
.flex1 span{
	color: #747B87;
	font-weight: 700;
	line-height: 40px;
}
.flex1:active{
  background-color: rgb(249,249,249);
  border: 0;
}
.flex1 a{
	color: #747B87;
}
.hbox{
	height: 46px;
	/*background-color: #EEEEEF !important;*/
	-webkit-box-shadow: 0 0 1px white;
	padding: 0;
}
.sendInfo{
	padding: 21px 0px;
	border-bottom: 1px #D2D2D2 solid;
	background-color: white;
	float: left;
	width: 100%
}
.infoTit{
	position: relative;
}
.infoTit input{
	width: 80%;
	height: 30px !important;
}
.infoTit div{
	width: 18%;
	display: inline-block;
	color: #B5BECE;
	font-size: 14px;
}
.AddAttachment{
	background-color: #EEEEEF;
	color: #5A6170;
	margin-bottom: 5px;
	font-size: 13px;
	cursor: pointer;
	width: 100px;
}
.AddAttachment img{
	height: 30px;
	vertical-align: middle;
}
.showText{
	z-index: 2;
	padding: 0px 10px;
	position: fixed;
	bottom: 44px;
	border-top: 1px #DDDDDD solid;
	width: 100%;
	color: #8F97A6;
	height: 40px;
	font-size: 14px;
	line-height: 40px;
	background-color: white;
	display: none;
}
/*.showText span{
	padding-left: 35px;
}*/
.showText .origivalTit{
	padding-left: 35px;
	color:black;
	font-weight: 800;
}
.origivalTitle{
	padding-left: 35px;
}
.addContact{
	position: absolute;
	height: 25px;
	top: 4%;
	right: 0;
}
.textImg{
	height: 25px;
	position: absolute;
	top: 8px;
}
.mailBody{
	z-index: 1;
	padding: 10px;
	outline:none;
	margin: 0px;
	border: 0;
	height:280px;
	resize:none;
}
.content{
	background-color: #FFFFFF !important;
	padding-bottom: 46px;

}
.titInfo{
	float: left;
	width: 100%;
	line-height: 30px;
	padding-bottom: 14px;
}
.editDiv{
	height: 30px;
	border: 1px #E5E7EA solid;
	position: relative;
	width: 79%;
	box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
border-radius: 3px;
margin-left: 5px;
}
.box{
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Safari */
	float: left;
}
.editTit{
	width: 17%;
	color: #747B87;
	font-size: 15px;
	text-align: right;
}
#address-top-list,#cc-top-list{
	height: 30px;
	position: relative;
	overflow: hidden;
	width: 85%;
}
.top-li{
	padding-left: 5px;
}
.theme{
	height: 30px !important;
	border-radius: 0 !important;
	background-color: transparent !important;
	border: 0px solid !important;
	padding-left: 5px !important;
	font-size: 14px;
}
.spanTXT{
	font-size: 12px;
	white-space: nowrap;

padding: 5px;
position: relative;
bottom: 2px;
border-radius: 10px;
margin-right: 3px;
/*border: 1px solid #1e7db9;
box-shadow: 0 1px 2px #8fcaee inset,0 -1px 0 #497897 inset,0 -2px 3px #8fcaee inset;
/* color: #fff; */
background: #274E96;
color: white;
}
.flex1 span{
  font-weight: inherit;
}

/*iscroll*/
#wrapper {
position:absolute;
width: 100%;
height: 100%;
overflow: hidden;
/* Prevent native touch events on Windows */
-ms-touch-action: none;
/* Prevent the callout on tap-hold and text selection */
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* Prevent text resize on orientation change, useful for web-apps */
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
-ms-text-size-adjust: none;
-o-text-size-adjust: none;
text-size-adjust: none;
}
#scroller {
position: fixed;
width: 100%;
/* Prevent elements to be highlighted on tap */
-webkit-tap-highlight-color: rgba(0,0,0,0);
/* Put the scroller into the HW Compositing layer right from the start */
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0);
}
.address-scroller,.cc-scroller{
	position: absolute;
	white-space: nowrap;
}
input[type="text"],textarea{
-webkit-touch-callout: auto !important;
-webkit-user-select: auto !important;
}
.goback{
	width: 50px;
text-align: left;
height: 100%;
margin-left: -10px !important;
padding-left: 8px !important;
}
/*提示框*/
	.dialogShade{
		position:fixed;
		width: 100%;
		height: 100%;
		z-index:999;
		display: none
	}
	.dialog{
		position:absolute;
		text-align: center;
		width: 200px;
		height: 90px;
		left: 50%;
		top: 50%;
		margin-left: -100px;
		border: none;
		color: #ccc;
		padding: 0px 20px;
		background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(00,00,00,.60)),to(rgba(00,00,00,.60)));
	}
	.dialogInfo{
		height: 35px;
		line-height: 35px;
		width: 100%;
		vertical-align: middle;
		text-align: center;
		border-bottom: 1px solid rgba(177,177,177,.20);

	}
	.dialogChoose{
		padding: 5px;
		height: 55px;
		line-height: 40px
	}
	.dialogChoose div{
		vertical-align: middle;
		width: 55px;
		color: #fff;
		display: inline-block;
		text-align: center;
		background: #389cff;
		height: 30px;
		line-height: 30px;
		margin: 5px;
		font-size: 14px;
	}

</style>
<header class="bar bar-nav mail">
	<a class="icon icon-left-nav pull-left" data-action="back"></a>
	<h1 class="title">写邮件</h1>
	
</header>
<!-- content -->
<div class="content">
	<div id="wrapper">
		<div id="scroller">
	<div class="sendInfo">
		<div class="titInfo">
			<div class="box editTit ">主题:</div>
			<div class="box editDiv"><input type="text" class="theme"></div>
		</div>
		<div class="titInfo">
			<div class="box editTit">收件人:</div>
			<div class="box editDiv addressDiv">
				<div class="top-li addAddress">
					<div id="address-top-list">
						<div class="address-scroller">
						</div>
					</div>
					<img src="../mail/img/add.png" alt="" class="addContact ">
				</div>
			</div>
		</div>
		<div class="titInfo">
			<div class="box editTit">抄送人:</div>
			<div class="box editDiv">
				<div class="top-li addMakeCopy">
					<div id="cc-top-list">
						<div class="cc-scroller">
						</div>
					</div>
					<img src="../mail/img/add.png" alt="" class="addContact ">
				</div>
			</div>
		</div>
		
	</div>
	<textarea class="mailBody" ></textarea>
	</div>
</div>
	<div class="showText">
		<div class="toggleText">
			<img src="../mail/img/showText.png" alt="" class="textImg">
			<span class="origivalTitle">显示原文内容</span>
		</div>
		<div id="text-scroll-warp">
			<div class="textContent" id="text-scroll">
			</div>
		</div>
	</div>
	<div class="bar bar-standard bar-footer hbox" style="text-align:center;">
		<p class="flex1 sendMail"><span>发送</span></p>
		<p class="flex1 saveMail"><span>保存为草稿</span></p>
	</div>
</div>
<div class="dialogShade">
		<div class="dialog">
					<div class="dialogInfo"><span>是否保存此邮件</span></div>
					<div class="dialogChoose">
							<div class="confirm">确定</div>
							<div class="cancel">取消</div>
					</div>
	</div>
</div>